<template>
	<view class="box">
		<view class="logo">
			<view class="img">
				<image :src="baseUrl+'https://jw.xzsw2021.com/static/img/logo.png'" mode=""></image>
			</view>
			<view class="name">
				<image :src="baseUrl+'https://jw.xzsw2021.com/static/img/name.png'" mode=""></image>
			</view>
			<view class="desc">
				挑菜选菜首选家味
			</view>
		</view>
		<view class="btn">
			<view class="no-login">
				<button @click="login2">取消登录</button>
			</view>
			<view>
				<button @tap.stop="login" v-if="!isLogin" :disabled="disable">点击登录</button>
				<button open-type="getPhoneNumber" lang="zh_CN" @getphonenumber="getphonenumber" :disabled="disable2"
					v-else>获取手机号权限</button>
			</view>
			<view class="xieyi fw-ct" @click="checkXy">
				<view class="icon">
					<image src="https://jw.xzsw2021.com/static/img/choose.png" mode="scaleToFill" v-if="is_xy"></image>
					<image src="https://jw.xzsw2021.com/static/img/choose2.png" mode="scaleToFill" v-else></image>
				</view>
				<view>我已阅读并同意<text class="c1" @click.stop="goXy">《用户协议》</text></view>
			</view>
		</view>
	</view>
</template>

<script>
	import Cache from '@/util/cache.js'
	export default {
		data() {
			return {
				fullHeight: '', //屏幕尺寸高度
				isLogin: false, //是否点击登录
				SessionKey: '',
				OpenId: '',
				nickName: null,
				avatarUrl: null,
				isCanUse: uni.getStorageSync('openid') || true, //默认为true
				userData: {
					openid: '',
					head_pic: '',
					nickname: '',
					session: '',
					iv: '',
					encryptedData: ''
				},
				canClick: true, //登录按钮控制
				disable: false,
				disable2: false, //获取手机号按钮
				baseUrl: '', //服务器地址
				is_xy: false, //
			}
		},
		onLoad(options) {
			console.log("dssdsd")
			// 获取当前手机屏幕高度
			this.$getHeight();
			if (options.type) {
				console.log(options.type);
				this.type = options.type;
				if (options.id) {
					this.id = options.id;
					console.log('id', options.id);
				}
			}
		},
		onShow() {
			if (Cache.get('token')) {
				uni.navigateBack({

				})
			}
		},
		methods: {

			// 选中协议
			checkXy() {
				this.is_xy = !this.is_xy;
			},
			goXy() {
				uni.navigateTo({
					url: '/pages/xieyi/xieyi?type=5'
				})
			},
			// 暂不登录
			login2() {
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
			//登录   调用顺序错误，有概率无法解密数据
			login_() {
				if (!this.is_xy) {
					uni.showToast({
						title: '请先同意用户协议',
						icon: 'none'
					})
					return false
				}
				let that = this;
				that.disable = true;
				uni.showLoading({
					title: '登录中',
					icon: 'none'
				});
				uni.getUserProfile({
					desc: '登录',
					success: ress => {
						let spread_spid = 0 //邀请人id
						if (Cache.get('spread_spid')) {
							spread_spid = Cache.get('spread_spid')
						} else if (Cache.get('spid')) {
							spread_spid = Cache.get('spid')
						}
						uni.login({
							provider: 'weixin',
							success: res => {
								uni.hideLoading();
								let code = res.code;
								let data = {
									code,
									iv: ress.iv,
									encryptedData: ress.encryptedData,
									spread_spid
								}
								this.$request('auth/mp', data).then(res => {
									if (res.status == 200) {
										// uni.setStorageSync('token', res.data.token)
										Cache.set('token', res.data.token)
										uni.navigateBack({

										})
									}
								})

							}
						});
					},
					fail: res => {
						that.disable = false;
						uni.hideLoading();
						uni.showToast({
							title: '授权失败',
							icon: 'none'
						});
					}
				});
			},

			//正确的登录
			login() {
				if (!this.is_xy) {
					uni.showToast({
						title: '请先同意用户协议',
						icon: 'none'
					})
					return false
				}
				let that = this;
				// that.disable = true;
				uni.login({
					provider: 'weixin',
					success: (res) => {
						console.log(res)
						wx.showModal({
							title:'授权登录',
							success: (show) => {
								if (show.confirm) {
									uni.getUserProfile({
										desc: '登录',
										success: (ress) => {
											uni.showLoading({
												title: '登录中',
												icon: 'none'
											});
											console.log(ress)
											let spread_spid = 0 //邀请人id
											if (Cache.get('spread_spid')) {
												spread_spid = Cache.get('spread_spid')
											} else if (Cache.get('spid')) {
												spread_spid = Cache.get('spid')
											}
											let code = res.code;
											let data = {
												code,
												iv: ress.iv,
												encryptedData: ress.encryptedData,
												spread_spid
											}
											this.$request('auth/mp', data).then(res => {
												uni.hideLoading();
												if (res.status == 200) {
													// uni.setStorageSync('token', res.data.token)
													Cache.set('token', res.data.token)
													uni.navigateBack({
											
													})
												}
											}).catch(err=>{
												uni.hideLoading();
											})
										},
										fail: (err) => {
											uni.hideLoading();
											uni.showToast({
												title: '请确认授权登录',
												icon: 'none'
											});
										}
									})
								}
							},
							fail: () => {
								wx.showToast({
									title: '您拒绝了请求,不能正常使用小程序',
									icon: 'error',
									duration: 2000
								});
							}
						})
					},
					fail: (err) => {
						console.log(err)
						that.disable = false;
						uni.hideLoading();
						uni.showToast({
							title: '授权失败',
							icon: 'none'
						});
					}
				})
			},
		}
	}
</script>

<style lang="less" scoped>
	.box {
		position: relative;
		overflow: hidden;

		.form {
			padding: 0 30rpx;
			font-size: 28rpx;

			.form-item {
				height: 150rpx;
				line-height: 150rpx;
				border-bottom: 1rpx solid #EEEEEE;

				.label {
					width: 180rpx;
				}

				.input {
					flex: 1;

					// background-color: pink;
					.icon {
						width: 15rpx;
						height: 30rpx;
						overflow: hidden;

						// background-color: #007AFF;
						image {
							width: 100%;
							height: 100%;
						}
					}
				}
			}
		}

		.logo {
			margin-top: 288rpx;
			text-align: center;

			.img {
				margin: 0 auto;
				width: 215rpx;
				height: 200rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.name {
				margin: 30rpx auto 25rpx;
				font-size: 36rpx;
				font-weight: bold;
				color: #DCAB03;

				image {
					width: 226rpx;
					height: 53rpx;
				}
			}

			.desc {
				font-size: 24rpx;
				font-weight: 400;
				color: #999999;
			}
		}

		.btn {
			position: fixed;
			width: 750rpx;
			left: 0;
			bottom: 200rpx;
			text-align: center;

			button {
				width: 310rpx;
				height: 90rpx;
				line-height: 90rpx;
				color: #fff;
				background: linear-gradient(64deg, #2BCCA5, #22B591);
				box-shadow: 0rpx 4rpx 6rpx 0rpx rgba(20, 187, 146, 0.4);
				border-radius: 45rpx;
				font-size: 32rpx;

			}

			.no-login {
				margin-bottom: 60rpx;

				button {
					background: rgba(255, 244, 243, 0);
					box-shadow: none;
					border: 2rpx solid #666666;
					color: #666666;
					border-radius: 45rpx;
				}
			}

			.c1 {
				color: #109C7A;
			}

			.xieyi {
				margin-top: 56rpx;
				font-size: 22rpx;
				color: #333;

				.icon {
					margin-right: 10rpx;
					width: 24rpx;
					height: 24rpx;

					image {
						width: 100%;
						height: 100%;
					}
				}
			}
		}

		button::after {
			border: none;
		}
	}
</style>
